<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>Document</title>
	</head>
	<body>
		<script>
			class Rectangle {
				// constructor
				constructor(height, width) {
					this.height = height
					this.width = width
				}

				// Getter
				get area() {
					return this.calcArea()
				}

				// Method
				calcArea() {
					return this.height * this.width
				}
			}

			const rectangle = new Rectangle(10, 20)
			console.log(rectangle.area)
			// 输出 200

			// 继承
			class Square extends Rectangle {
				constructor(length) {
					super(length, length)

					// 如果子类中存在构造函数，则需要在使用“this”之前首先调用 super()。
					this.name = 'Square'
				}

				get area() {
					return this.height * this.width
				}
			}

			const square = new Square(10)
			console.log(square.area)
			// 输出 100
		</script>
	</body>
</html>
